o<template>
	
	<div class="main-div">
		
		<div class="header-div">
			<b>{{ titleEdit }}</b>
		</div>
       <el-form 
	   		:model="form" 
	   		label-width="150px"
			class="form-demo" >
         <el-form-item>
			<template #label>
				<span class="custom-label">题库名称：</span>
			</template>
            <el-input v-model="form.question_bank"></el-input>
         </el-form-item>
         <el-form-item >
			<template #label>
				<span class="custom-label">题库状态：</span>
			</template>
            <!-- <el-input v-model="form.status"></el-input> -->
			<el-radio-group v-model="form.status" >
				<el-radio value="正常">正常</el-radio>
				<el-radio value="禁用">禁用</el-radio>
			</el-radio-group>

         </el-form-item>
         <el-form-item >
			<template #label>
				<span class="custom-label">题库说明：</span>
			</template>
            <el-input v-model="form.hints" type="textarea"></el-input>
         </el-form-item>
		 <el-form-item>
			<el-button color="#1C84C6" @click="onSubmit">提交</el-button>
			<el-button @click="rollback" v-if="other=='other'">返回</el-button>
			<el-button @click="reSet" v-else>重新填写</el-button>
			</el-form-item>
       	</el-form>
		
    </div>
		<!-- </div> -->
	<!-- </div> -->
</template>

<script setup >
import { ref, reactive ,toRefs,onMounted,watch} from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
// const props = defineProps({
// 	rowData:Object,
// 	other:String,
// })
const props = defineProps(['rowData','other'])
const {rowData,other} = toRefs(props)
console.log(rowData?.value,'<<<<<row')
const emit = defineEmits(['upadate:rowData','change'])
watch([rowData],(old,newX)=>{
	console.log('old',old,'newValue',newX,'11')
		form.question_bank = ''
		form.id = ''
		form.status ='正常'
		form.hints = ''
		titleEdit.value='创建题库'
})
onMounted(()=>{
	console.log(rowData?.value,'onMouted')
	if(rowData?.value){
		form.question_bank = rowData.value.question_bank
		form.id = rowData.value.id
		form.status = rowData.value.status
		form.hints = rowData.value.hints
		titleEdit.value='修改题库'
		// console.log(form.id,'rrrr')
	}else{
		titleEdit.value='创建题库'
		console.log(rowData,form,'rf')
	}
})
// 表格编辑时弹窗和保存
const editVisible = ref(false);
let form = reactive({
    id:'',
	question_bank: '',
    status:'正常',
    hints:'',
});

// 头部标题
let titleEdit = ref('创建题库')

//保存添加或者修改的数据 ---需要重新实现
const onSubmit = () => {
	
	//
};
//重置 
function reSet(){
	form.question_bank=''
	form.hints=''
}
//返回 
const rollback = ()=>{
  emit('change',true)
}
</script >
<style lang="less" scoped>
.el-form .el-input {
	width: 50%;
	
}
.el-form .el-textarea {
	width: 50%;
	
}
.custom-label{
	font-size: 14px;
  	font-weight: 900;
  	color: #666;
}
.header-div{
	background-color: #F5F5F5;
	color: #666666;
	margin: 0px 0px 10px;
	padding: 10px 10px; 
	font-size: 14px;
}
.main-div{
	border: 1px solid #f0f0f0;
 padding: 0px,15px,15px,15px;
}


</style>